<!--
 * @Description: Element
 * @Author: rendc
 * @Date: 2021-09-06 10:22:16
 * @LastEditors: rendc
 * @LastEditTime: 2021-09-06 11:36:31
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- <script src="./test.js"></script> -->
  <title>Element</title>
</head>

<body>
  <div class="one" id="myDiv" style="color: brown;">
    <div class="div1-1">1</div>
    <div class="div1-2">2</div>
    <div class="div1-3">3</div>
    <div class="div1-4">4</div>
  </div>
  <!-- <img src="../test.png" alt="图片丢失" style="color: hotpink;"> -->
</body>

<script>
  var myDiv = document.getElementById("myDiv");
  // console.log(myDiv);
  // console.log(myDiv.firstElementChild.nextElementSibling);
  // console.log(myDiv.lastElementChild.previousElementSibling);
  console.log(myDiv.childElementCount); // 4
  console.log(myDiv);
  console.log(myDiv.innerHTML);
  console.log(myDiv.textContent);
</script>

</html>